<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>错误信息提示</title>
		<link rel="stylesheet" href="../../common/css/bootstrap.min.css">
		<link rel="stylesheet" href="../../common/css/public.css">
	</head>
	<body>
		<div id="alert" class="el-massage el-message--error">
			<i><img src="../../images/error.png"></i>
			<strong class="el-strong"></strong>
		</div>
		<form class="form-horizontal" role="form" id="app">
			<div class="form-group">
				<label class="control-label">详细地址</label>
				<div class="col-sm-12">
					<input type="text" class="form-control" placeholder="请输入详细地址" v-model="address">
				</div>
			</div>
			<div class="form-group">
				<label class="control-label">姓名</label>
				<div class="col-sm-12">
					<input type="text" class="form-control" placeholder="请输入姓名" v-model="name">
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-10">
					<!--登录按钮，这里不能用button，button会刷新，具体原因不知道-->
					<span type="submit" class="btn btn-default" @click="setMsg">{{login}}</span>
				</div>
			</div>
		</form>
	</body>
	<script src="../../common/js/vue2.5.js"></script>
	<script src="../../common/js/jquery.min.js"></script>
	<script src="../../common/js/bootstrap.min.js"></script>
	<script src="../../common/js/components.js"></script>
	<script>
		var vm = new Vue({
			el: '#app',
			data: {
				login: '登录',
				address: '',
				name: ''
			},
			methods: {
				setMsg: function() {
					if(this.address == '') {
						stipsTr('详细地址不能为空');
						return
					} else if(this.name == '') {
						stipsTr('姓名不能为空');
						return
					}
				}
			}
		})
	</script>

</html>